<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=2">
<meta name="theme-color" content="#222">
<meta name="generator" content="Hexo 6.3.0">
  <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon-next.png">
  <link rel="icon" type="image/png" sizes="32x32" href="/images/favicon-32x32-next.png">
  <link rel="icon" type="image/png" sizes="16x16" href="/images/favicon-16x16-next.png">
  <link rel="mask-icon" href="/images/logo.svg" color="#222">

<link rel="stylesheet" href="/css/main.css">


<link rel="stylesheet" href="/lib/font-awesome/css/font-awesome.min.css">

<script id="hexo-configurations">
    var NexT = window.NexT || {};
    var CONFIG = {"hostname":"example.com","root":"/","scheme":"Mist","version":"7.8.0","exturl":false,"sidebar":{"position":"left","display":"post","padding":18,"offset":12,"onmobile":false},"copycode":{"enable":false,"show_result":false,"style":null},"back2top":{"enable":true,"sidebar":false,"scrollpercent":false},"bookmark":{"enable":false,"color":"#222","save":"auto"},"fancybox":false,"mediumzoom":false,"lazyload":false,"pangu":false,"comments":{"style":"tabs","active":null,"storage":true,"lazyload":false,"nav":null},"algolia":{"hits":{"per_page":10},"labels":{"input_placeholder":"Search for Posts","hits_empty":"We didn't find any results for the search: ${query}","hits_stats":"${hits} results found in ${time} ms"}},"localsearch":{"enable":true,"trigger":"manual","top_n_per_article":1,"unescape":false,"preload":false},"motion":{"enable":true,"async":false,"transition":{"post_block":"fadeIn","post_header":"slideDownIn","post_body":"slideDownIn","coll_header":"slideLeftIn","sidebar":"slideUpIn"}},"path":"search.xml"};
  </script>

  <meta name="description" content="1. 下载Next这里不使用git而使用curl操作，因为我的整个站点源文件已经托管到GitHub，使用git clone可能会导致仓库嵌套以及配置文件丢失等问题。 使用curl、tar、wget下载Next主题需进入站点根目录下，然后使用如下命令 12mkdir themes&#x2F;nextcurl -s https:&#x2F;&#x2F;api.github.com&#x2F;repos&#x2F;theme-next&#x2F;hexo-the">
<meta property="og:type" content="article">
<meta property="og:title" content="Hexo使用Next主题">
<meta property="og:url" content="http://example.com/2023/04/07/Hexo%E4%BD%BF%E7%94%A8Next%E4%B8%BB%E9%A2%98/index.html">
<meta property="og:site_name" content="Lu&#39;s Blog">
<meta property="og:description" content="1. 下载Next这里不使用git而使用curl操作，因为我的整个站点源文件已经托管到GitHub，使用git clone可能会导致仓库嵌套以及配置文件丢失等问题。 使用curl、tar、wget下载Next主题需进入站点根目录下，然后使用如下命令 12mkdir themes&#x2F;nextcurl -s https:&#x2F;&#x2F;api.github.com&#x2F;repos&#x2F;theme-next&#x2F;hexo-the">
<meta property="og:locale" content="zh_CN">
<meta property="og:image" content="http://example.com/2023/04/07/Hexo%E4%BD%BF%E7%94%A8Next%E4%B8%BB%E9%A2%98/footer.swig.png">
<meta property="og:image" content="http://example.com/2023/04/07/Hexo%E4%BD%BF%E7%94%A8Next%E4%B8%BB%E9%A2%98/CopyrightDesignSketch.png">
<meta property="article:published_time" content="2023-04-06T17:09:01.697Z">
<meta property="article:modified_time" content="2023-04-06T17:13:42.988Z">
<meta property="article:author" content="Lu">
<meta property="article:tag" content="Hexo">
<meta property="article:tag" content="GitHub">
<meta property="article:tag" content="Blog">
<meta property="article:tag" content="NexT">
<meta name="twitter:card" content="summary">
<meta name="twitter:image" content="http://example.com/2023/04/07/Hexo%E4%BD%BF%E7%94%A8Next%E4%B8%BB%E9%A2%98/footer.swig.png">

<link rel="canonical" href="http://example.com/2023/04/07/Hexo%E4%BD%BF%E7%94%A8Next%E4%B8%BB%E9%A2%98/">


<script id="page-configurations">
  // https://hexo.io/docs/variables.html
  CONFIG.page = {
    sidebar: "",
    isHome : false,
    isPost : true,
    lang   : 'zh-CN'
  };
</script>

  <title>Hexo使用Next主题 | Lu's Blog</title>
  






  <noscript>
  <style>
  .use-motion .brand,
  .use-motion .menu-item,
  .sidebar-inner,
  .use-motion .post-block,
  .use-motion .pagination,
  .use-motion .comments,
  .use-motion .post-header,
  .use-motion .post-body,
  .use-motion .collection-header { opacity: initial; }

  .use-motion .site-title,
  .use-motion .site-subtitle {
    opacity: initial;
    top: initial;
  }

  .use-motion .logo-line-before i { left: initial; }
  .use-motion .logo-line-after i { right: initial; }
  </style>
</noscript>

</head>

<body itemscope itemtype="http://schema.org/WebPage">
  <div class="container use-motion">
    <div class="headband"></div>

    <header class="header" itemscope itemtype="http://schema.org/WPHeader">
      <div class="header-inner"><div class="site-brand-container">
  <div class="site-nav-toggle">
    <div class="toggle" aria-label="切换导航栏">
      <span class="toggle-line toggle-line-first"></span>
      <span class="toggle-line toggle-line-middle"></span>
      <span class="toggle-line toggle-line-last"></span>
    </div>
  </div>

  <div class="site-meta">

    <a href="/" class="brand" rel="start">
      <span class="logo-line-before"><i></i></span>
      <h1 class="site-title">Lu's Blog</h1>
      <span class="logo-line-after"><i></i></span>
    </a>
      <p class="site-subtitle" itemprop="description">遇事不决，可问春风</p>
  </div>

  <div class="site-nav-right">
    <div class="toggle popup-trigger">
        <i class="fa fa-search fa-fw fa-lg"></i>
    </div>
  </div>
</div>




<nav class="site-nav">
  <ul id="menu" class="menu">
        <li class="menu-item menu-item-home">

    <a href="/" rel="section"><i class="fa fa-fw fa-home"></i>首页</a>

  </li>
        <li class="menu-item menu-item-categories">

    <a href="/categories/" rel="section"><i class="fa fa-fw fa-th"></i>分类</a>

  </li>
        <li class="menu-item menu-item-tags">

    <a href="/tags/" rel="section"><i class="fa fa-fw fa-tags"></i>标签</a>

  </li>
        <li class="menu-item menu-item-archives">

    <a href="/archives/" rel="section"><i class="fa fa-fw fa-archive"></i>归档</a>

  </li>
        <li class="menu-item menu-item-about">

    <a href="/about/" rel="section"><i class="fa fa-fw fa-user"></i>关于</a>

  </li>
      <li class="menu-item menu-item-search">
        <a role="button" class="popup-trigger"><i class="fa fa-search fa-fw"></i>搜索
        </a>
      </li>
  </ul>
</nav>



  <div class="search-pop-overlay">
    <div class="popup search-popup">
        <div class="search-header">
  <span class="search-icon">
    <i class="fa fa-search"></i>
  </span>
  <div class="search-input-container">
    <input autocomplete="off" autocapitalize="off"
           placeholder="搜索..." spellcheck="false"
           type="search" class="search-input">
  </div>
  <span class="popup-btn-close">
    <i class="fa fa-times-circle"></i>
  </span>
</div>
<div id="search-result">
  <div id="no-result">
    <i class="fa fa-spinner fa-pulse fa-5x fa-fw"></i>
  </div>
</div>

    </div>
  </div>

</div>
    </header>

    
  <div class="back-to-top">
    <i class="fa fa-arrow-up"></i>
    <span>0%</span>
  </div>


    <main class="main">
      <div class="main-inner">
        <div class="content-wrap">
          

          <div class="content post posts-expand">
            

    
  
  
  <article itemscope itemtype="http://schema.org/Article" class="post-block" lang="zh-CN">
    <link itemprop="mainEntityOfPage" href="http://example.com/2023/04/07/Hexo%E4%BD%BF%E7%94%A8Next%E4%B8%BB%E9%A2%98/">

    <span hidden itemprop="author" itemscope itemtype="http://schema.org/Person">
      <meta itemprop="image" content="/images/avatar.gif">
      <meta itemprop="name" content="Lu">
      <meta itemprop="description" content="遇事不决，可问春风">
    </span>

    <span hidden itemprop="publisher" itemscope itemtype="http://schema.org/Organization">
      <meta itemprop="name" content="Lu's Blog">
    </span>
      <header class="post-header">
        <h1 class="post-title" itemprop="name headline">
          Hexo使用Next主题
        </h1>

        <div class="post-meta">
          
            <span class="post-meta-item">
              <span class="post-meta-item-icon">
                <i class="fa fa-calendar-o"></i>
              </span>
              <span class="post-meta-item-text">发表于</span>
              

              <time title="创建时间：2023-04-07 01:09:01 / 修改时间：01:13:42" itemprop="dateCreated datePublished" datetime="2023-04-07T01:09:01+08:00">2023-04-07</time>
            </span>
            <span class="post-meta-item">
              <span class="post-meta-item-icon">
                <i class="fa fa-folder-o"></i>
              </span>
              <span class="post-meta-item-text">分类于</span>
                <span itemprop="about" itemscope itemtype="http://schema.org/Thing">
                  <a href="/categories/%E5%8D%9A%E5%AE%A2%E6%90%AD%E5%BB%BA%E4%B9%8B%E8%B7%AF/" itemprop="url" rel="index"><span itemprop="name">博客搭建之路</span></a>
                </span>
            </span>

          
            <span class="post-meta-item" title="阅读次数" id="busuanzi_container_page_pv" style="display: none;">
              <span class="post-meta-item-icon">
                <i class="fa fa-eye"></i>
              </span>
              <span class="post-meta-item-text">阅读次数：</span>
              <span id="busuanzi_value_page_pv"></span>
            </span>

        </div>
      </header>

    
    
    
    <div class="post-body" itemprop="articleBody">

      
        <h2 id="1-下载Next"><a href="#1-下载Next" class="headerlink" title="1. 下载Next"></a>1. 下载Next</h2><p>这里不使用<code>git</code>而使用<code>curl</code>操作，因为我的整个站点源文件已经托管到<code>GitHub</code>，使用<code>git clone</code>可能会导致仓库嵌套以及配置文件丢失等问题。</p>
<p>使用<code>curl</code>、<code>tar</code>、<code>wget</code>下载<code>Next</code>主题需进入站点根目录下，然后使用如下命令</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">mkdir themes/next</span><br><span class="line">curl -s https://api.github.com/repos/theme-next/hexo-theme-next/releases/latest | grep tarball_url | cut -d &#x27;&quot;&#x27; -f 4 | wget -i - -O- | tar -zx -C themes/next --strip-components=1</span><br></pre></td></tr></table></figure>

<h2 id="2-修改配置文件"><a href="#2-修改配置文件" class="headerlink" title="2. 修改配置文件"></a>2. 修改配置文件</h2><p>打开站点根目录下的<code>_config.yml</code>文件，修改配置信息（冒号后面需要跟空格）</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line"># Site</span><br><span class="line">title: Lu&#x27;s Blog</span><br><span class="line">subtitle: &#x27;&#x27;</span><br><span class="line">description: &#x27;遇事不决，可问春风&#x27; </span><br><span class="line">keywords:</span><br><span class="line">author: Lu</span><br><span class="line">language: zh-CN         #主题语言，在themes/next/language目录下</span><br><span class="line">timezone: &#x27;Asia/Shanghai&#x27;      #时区</span><br><span class="line"></span><br><span class="line"># Extensions</span><br><span class="line">## Plugins: https://hexo.io/plugins/</span><br><span class="line">## Themes: https://hexo.io/themes/</span><br><span class="line">theme: next</span><br></pre></td></tr></table></figure>

<p>另外<code>Next</code>的主题有四种，分别为<code>Muse</code>、<code>Mist</code>、<code>Pices</code>、<code>Gemini</code>，默认为<code>Muse</code>主题，如需修改则到<code>themes/next</code>目录下，修改<code>_confit.yml</code>文件，将需要使用的主题的注释去除。</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"># Schemes</span><br><span class="line">#scheme: Muse</span><br><span class="line">scheme: Mist</span><br><span class="line">#scheme: Pisces</span><br><span class="line">#scheme: Gemini</span><br></pre></td></tr></table></figure>

<span id="more"></span>

<h2 id="3-设置菜单"><a href="#3-设置菜单" class="headerlink" title="3. 设置菜单"></a>3. 设置菜单</h2><p>打开<code>themes/next/_config.yml</code>文件，修改<code>menu</code>项如下</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><span class="line">menu:</span><br><span class="line">  home: / || home #首页</span><br><span class="line">  categories: /categories/ || th #分类</span><br><span class="line">  tags: /tags/ || tags          #标签</span><br><span class="line">  archives: /archives/ || archive #归档</span><br><span class="line">  about: /about/ || user       #关于</span><br><span class="line">  #schedule: /schedule/ || calendar  #时间日历</span><br><span class="line">  #sitemap: /sitemap.xml || sitemap  #站点地图</span><br><span class="line">  #commonweal: /404/ || heartbeat  #腾讯地图</span><br></pre></td></tr></table></figure>

<p>其中<code>||</code>前是目标链接，后面是图标名称，以上为<code>Next</code>主题中默认添加的，也可以自己添加。</p>
<p>之后打开<code>themes/next/language/zh-CN.yml</code>文件，在<code>munu</code>标签中进行设置，从而进行中文翻译</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br></pre></td><td class="code"><pre><span class="line">menu:</span><br><span class="line">  home: 首页</span><br><span class="line">  archives: 归档</span><br><span class="line">  categories: 分类</span><br><span class="line">  tags: 标签</span><br><span class="line">  about: 关于</span><br><span class="line">  search: 搜索</span><br><span class="line">  schedule: 日程表</span><br><span class="line">  sitemap: 站点地图</span><br><span class="line">  commonweal: 公益 404</span><br></pre></td></tr></table></figure>

<p>以上内容在<code>Next</code>主题中已默认设置，新添加<code>Item</code>在该项中添加即可。</p>
<p>随后在根目录下输入命令</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">hexo new page &quot;categories&quot;</span><br><span class="line">hexo new page &quot;tags&quot;</span><br><span class="line">hexo new page &quot;about&quot;</span><br></pre></td></tr></table></figure>

<p>创建<code>source/categories</code>、<code>source/tags</code>和<code>source/about</code>目录，并在每个目录下生成一个<code>index.md</code>文件，分别打开每个目录下的<code>index.md</code>文件，修改其中内容如下</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br></pre></td><td class="code"><pre><span class="line">#source/categories/index.md</span><br><span class="line">---</span><br><span class="line">title: 分类</span><br><span class="line">date: 2023-04-05 22:35:50</span><br><span class="line">type: &quot;categories&quot;</span><br><span class="line">---</span><br><span class="line"></span><br><span class="line">#source/tags/index.md</span><br><span class="line">---</span><br><span class="line">title: 标签</span><br><span class="line">date: 2023-04-05 22:35:34</span><br><span class="line">type: &quot;tags&quot;</span><br><span class="line">---</span><br><span class="line"></span><br><span class="line">#source/about/index.md</span><br><span class="line">---</span><br><span class="line">title: 关于</span><br><span class="line">date: 2023-04-05 22:35:24</span><br><span class="line">type: &quot;about&quot;</span><br><span class="line">---</span><br></pre></td></tr></table></figure>

<h2 id="4-设置建站时间"><a href="#4-设置建站时间" class="headerlink" title="4. 设置建站时间"></a>4. 设置建站时间</h2><p>修改<code>themes/next/_config.yml</code>文件中的<code>since</code>标签</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">footer:</span><br><span class="line">  # Specify the date when the site was setup. If not defined, current year will be used.</span><br><span class="line">  since: 2023-04</span><br></pre></td></tr></table></figure>

<p>另外，<code>next</code>主题下，默认会有个年份，加起来就会很别扭，可以在<code>themes/next/layout/_partials/footer.swig</code>文件中进行修改</p>
<img src="/2023/04/07/Hexo%E4%BD%BF%E7%94%A8Next%E4%B8%BB%E9%A2%98/footer.swig.png" class="" title="footer.swig">

<p>删去第三行<code>&#123;% endif %&#125;</code>前面的的<code>-</code> 以及<code> &lt;span itemprop=&quot;copyrightYear&quot;&gt;&#123;&#123; copyright_year &#125;&#125;&lt;/span&gt;</code>这一行即可，其他内容也可在此文件中进行修改。</p>
<h2 id="5-设置网站图标"><a href="#5-设置网站图标" class="headerlink" title="5. 设置网站图标"></a>5. 设置网站图标</h2><p>下载<code>16X16</code>和<code>32x32</code>的图标后，在<code>themes/next/_config.yml</code>中进行<code>favicon</code>项的修改即可，一般仅需修改<code>small</code>和<code>medium</code>项</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">favicon:</span><br><span class="line">  small: /images/favicon-16x16-next.png</span><br><span class="line">  medium: /images/favicon-32x32-next.png</span><br><span class="line">  apple_touch_icon: /images/apple-touch-icon-next.png</span><br><span class="line">  safari_pinned_tab: /images/logo.svg</span><br><span class="line">  #android_manifest: /images/manifest.json</span><br><span class="line">  #ms_browserconfig: /images/browserconfig.xml</span><br></pre></td></tr></table></figure>

<h2 id="6-设置Canvas-Nest动态背景"><a href="#6-设置Canvas-Nest动态背景" class="headerlink" title="6. 设置Canvas Nest动态背景"></a>6. 设置Canvas Nest动态背景</h2><p>创建文件<code>source/_data/footer.swig</code>，并在其中输入</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">&lt;script color=&quot;0,0,255&quot; opacity=&quot;0.5&quot; zIndex=&quot;-1&quot; count=&quot;99&quot; src=&quot;https://cdn.jsdelivr.net/npm/canvas-nest.js@1/dist/canvas-nest.js&quot;&gt;&lt;/script&gt;</span><br></pre></td></tr></table></figure>

<p>之后修改<code>themes/next/_config.yml</code>文件中<code>custom_file_path</code>项为</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line"># Define custom file paths.</span><br><span class="line"># Create your custom files in site directory `source/_data` and uncomment needed files below.</span><br><span class="line">custom_file_path:</span><br><span class="line">  #head: source/_data/head.swig</span><br><span class="line">  #header: source/_data/header.swig</span><br><span class="line">  #sidebar: source/_data/sidebar.swig</span><br><span class="line">  #postMeta: source/_data/post-meta.swig</span><br><span class="line">  #postBodyEnd: source/_data/post-body-end.swig</span><br><span class="line">  footer: source/_data/footer.swig</span><br><span class="line">  #bodyEnd: source/_data/body-end.swig</span><br><span class="line">  #variable: source/_data/variables.styl</span><br><span class="line">  #mixin: source/_data/mixins.styl</span><br><span class="line">  #style: source/_data/styles.styl</span><br></pre></td></tr></table></figure>

<h2 id="7-文章末尾添加版权说明"><a href="#7-文章末尾添加版权说明" class="headerlink" title="7. 文章末尾添加版权说明"></a>7. 文章末尾添加版权说明</h2><p>修改<code>themes/next/_config.yml</code>文件中的<code>creative_commons</code>项的<code>post</code>属性为<code>true</code></p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br></pre></td><td class="code"><pre><span class="line"># Creative Commons 4.0 International License.</span><br><span class="line"># See: https://creativecommons.org/share-your-work/licensing-types-examples</span><br><span class="line"># Available values of license: by | by-nc | by-nc-nd | by-nc-sa | by-nd | by-sa | zero</span><br><span class="line"># You can set a language value if you prefer a translated version of CC license, e.g. deed.zh</span><br><span class="line"># CC licenses are available in 39 languages, you can find the specific and correct abbreviation you need on https://creativecommons.org</span><br><span class="line">creative_commons:</span><br><span class="line">  license: by-nc-sa</span><br><span class="line">  sidebar: false</span><br><span class="line">  post: true  # 显示版权说明</span><br><span class="line">  language:</span><br></pre></td></tr></table></figure>

<p>效果图：</p>
<img src="/2023/04/07/Hexo%E4%BD%BF%E7%94%A8Next%E4%B8%BB%E9%A2%98/CopyrightDesignSketch.png" class="" title="文章尾版权信息">

<h2 id="8-添加访问量统计"><a href="#8-添加访问量统计" class="headerlink" title="8. 添加访问量统计"></a>8. 添加访问量统计</h2><p>修改<code>themes/next/_config.yml</code>文件中<code>busuanzi_count</code>项中<code>enable</code>属性为<code>true</code></p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br></pre></td><td class="code"><pre><span class="line"># Show Views / Visitors of the website / page with busuanzi.</span><br><span class="line"># Get more information on http://ibruce.info/2015/04/04/busuanzi</span><br><span class="line">busuanzi_count:</span><br><span class="line">  enable: true</span><br><span class="line">  total_visitors: true</span><br><span class="line">  total_visitors_icon: user</span><br><span class="line">  total_views: true</span><br><span class="line">  total_views_icon: eye</span><br><span class="line">  post_views: true</span><br><span class="line">  post_views_icon: eye</span><br></pre></td></tr></table></figure>

<h2 id="9-增加本地搜索功能"><a href="#9-增加本地搜索功能" class="headerlink" title="9. 增加本地搜索功能"></a>9. 增加本地搜索功能</h2><p>使用<code>npm</code>安装插件</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">npm install hexo-generator-search --save</span><br></pre></td></tr></table></figure>

<p>之后修改<code>themes/next/_config.yml</code>中<code>local_search</code>项为</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line"># Local Search</span><br><span class="line"># Dependencies: https://github.com/theme-next/hexo-generator-searchdb</span><br><span class="line">local_search:</span><br><span class="line">  enable: true</span><br><span class="line">  # If auto, trigger search by changing input.</span><br><span class="line">  # If manual, trigger search by pressing enter key or search button.</span><br><span class="line">  trigger: manual  #手动触发</span><br><span class="line">  # Show top n results per article, show all results by setting to -1</span><br><span class="line">  top_n_per_article: 1</span><br><span class="line">  # Unescape html strings to the readable one.</span><br><span class="line">  unescape: false</span><br><span class="line">  # Preload the search data when the page loads.</span><br><span class="line">  preload: false</span><br></pre></td></tr></table></figure>

<h2 id="10-博客提交百度和Google收录"><a href="#10-博客提交百度和Google收录" class="headerlink" title="10. 博客提交百度和Google收录"></a>10. 博客提交百度和Google收录</h2><p>使用<code>npm</code>安装插件</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">npm install hexo-generator-baidu-sitemap --save</span><br><span class="line">npm install hexo-generator-sitemap --save</span><br></pre></td></tr></table></figure>

<p>然后修改<code>_config.yml</code>文件新增内容如下</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"># 自动生成sitemap</span><br><span class="line">sitemap:</span><br><span class="line">  path: sitemap.xml</span><br><span class="line">baidusitemap:</span><br><span class="line">  path: baidusitemap.xml</span><br></pre></td></tr></table></figure>

<h2 id="11-博文置顶功能"><a href="#11-博文置顶功能" class="headerlink" title="11. 博文置顶功能"></a>11. 博文置顶功能</h2><p>使用<code>npm</code>安装插件</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">npm uninstall hexo-generator-index --save</span><br><span class="line">npm install hexo-generator-index-pin-top --save</span><br></pre></td></tr></table></figure>

<p>打开<code>themes/next/layout/_macro/post.swig文件</code>，定位到<code>&lt;div class=&quot;post-meta&quot;&gt;</code>标签下，插入如下代码</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">&#123;% if post.top %&#125;</span><br><span class="line">  &lt;i class=&quot;fa fa-thumb-tack&quot;&gt;&lt;/i&gt;</span><br><span class="line">  &lt;font color=7D26CD&gt;置顶&lt;/font&gt;</span><br><span class="line">  &lt;span class=&quot;post-meta-divider&quot;&gt;|&lt;/span&gt;</span><br><span class="line">&#123;% endif %&#125;</span><br></pre></td></tr></table></figure>

<p>之后在需要置顶文章的<code>Front-matter</code>中添加<code>top: true</code>标签即可</p>
<h2 id="12-使用markdown方式插入图片"><a href="#12-使用markdown方式插入图片" class="headerlink" title="12. 使用markdown方式插入图片"></a>12. 使用markdown方式插入图片</h2><p>使用<code>npm</code>安装插件</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">npm install hexo-renderer-marked --save</span><br></pre></td></tr></table></figure>

<p>之后修改<code>_config.yml</code>文件中<code>post_asset_folder</code>属性并新增<code>marked</code>项如下</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">post_asset_folder: true</span><br><span class="line">marked:</span><br><span class="line">  prependRoot: true</span><br><span class="line">  postAsset: true</span><br></pre></td></tr></table></figure>

<p>此时在使用<code>hexo new</code>命令生成新博客文章时，会在文章所在目录下生成一个同名文件夹，将图片放在该文件夹中，直接使用</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">![](image.jpg)</span><br></pre></td></tr></table></figure>

<p>即可在<code>hexo</code>发布时正常显示图片，但是此时该图片不能在<code>markdown</code>中正常显示，因为<code>markdown</code>中命名方式为</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% asset_img "image.jpg" "" %}</span><br></pre></td></tr></table></figure>

<p>所有还需要安装<code>hexo-image-link</code>插件</p>
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">npm install hexo-image-link --save</span><br></pre></td></tr></table></figure>

<p>此时采用<code>markdown</code>命名格式的图片在<code>hexo</code>发布后仍然能正常显示。</p>

    </div>

    
    
    
        

<div>
<ul class="post-copyright">
  <li class="post-copyright-author">
    <strong>本文作者： </strong>Lu
  </li>
  <li class="post-copyright-link">
    <strong>本文链接：</strong>
    <a href="http://example.com/2023/04/07/Hexo%E4%BD%BF%E7%94%A8Next%E4%B8%BB%E9%A2%98/" title="Hexo使用Next主题">http://example.com/2023/04/07/Hexo使用Next主题/</a>
  </li>
  <li class="post-copyright-license">
    <strong>版权声明： </strong>本博客所有文章除特别声明外，均采用 <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/" rel="noopener" target="_blank"><i class="fa fa-fw fa-creative-commons"></i>BY-NC-SA</a> 许可协议。转载请注明出处！
  </li>
</ul>
</div>


      <footer class="post-footer">
          <div class="post-tags">
              <a href="/tags/Hexo/" rel="tag"># Hexo</a>
              <a href="/tags/GitHub/" rel="tag"># GitHub</a>
              <a href="/tags/Blog/" rel="tag"># Blog</a>
              <a href="/tags/NexT/" rel="tag"># NexT</a>
          </div>

        


        
    <div class="post-nav">
      <div class="post-nav-item">
    <a href="/2023/04/06/%E4%BD%BF%E7%94%A8Hexo+GitHub%E6%90%AD%E5%BB%BA%E4%B8%AA%E4%BA%BA%E5%8D%9A%E5%AE%A2/" rel="prev" title="使用Hexo+GitHub搭建个人博客">
      <i class="fa fa-chevron-left"></i> 使用Hexo+GitHub搭建个人博客
    </a></div>
      <div class="post-nav-item"></div>
    </div>
      </footer>
    
  </article>
  
  
  



          </div>
          

<script>
  window.addEventListener('tabs:register', () => {
    let { activeClass } = CONFIG.comments;
    if (CONFIG.comments.storage) {
      activeClass = localStorage.getItem('comments_active') || activeClass;
    }
    if (activeClass) {
      let activeTab = document.querySelector(`a[href="#comment-${activeClass}"]`);
      if (activeTab) {
        activeTab.click();
      }
    }
  });
  if (CONFIG.comments.storage) {
    window.addEventListener('tabs:click', event => {
      if (!event.target.matches('.tabs-comment .tab-content .tab-pane')) return;
      let commentClass = event.target.classList[1];
      localStorage.setItem('comments_active', commentClass);
    });
  }
</script>

        </div>
          
  
  <div class="toggle sidebar-toggle">
    <span class="toggle-line toggle-line-first"></span>
    <span class="toggle-line toggle-line-middle"></span>
    <span class="toggle-line toggle-line-last"></span>
  </div>

  <aside class="sidebar">
    <div class="sidebar-inner">

      <ul class="sidebar-nav motion-element">
        <li class="sidebar-nav-toc">
          文章目录
        </li>
        <li class="sidebar-nav-overview">
          站点概览
        </li>
      </ul>

      <!--noindex-->
      <div class="post-toc-wrap sidebar-panel">
          <div class="post-toc motion-element"><ol class="nav"><li class="nav-item nav-level-2"><a class="nav-link" href="#1-%E4%B8%8B%E8%BD%BDNext"><span class="nav-number">1.</span> <span class="nav-text">1. 下载Next</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#2-%E4%BF%AE%E6%94%B9%E9%85%8D%E7%BD%AE%E6%96%87%E4%BB%B6"><span class="nav-number">2.</span> <span class="nav-text">2. 修改配置文件</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#3-%E8%AE%BE%E7%BD%AE%E8%8F%9C%E5%8D%95"><span class="nav-number">3.</span> <span class="nav-text">3. 设置菜单</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#4-%E8%AE%BE%E7%BD%AE%E5%BB%BA%E7%AB%99%E6%97%B6%E9%97%B4"><span class="nav-number">4.</span> <span class="nav-text">4. 设置建站时间</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#5-%E8%AE%BE%E7%BD%AE%E7%BD%91%E7%AB%99%E5%9B%BE%E6%A0%87"><span class="nav-number">5.</span> <span class="nav-text">5. 设置网站图标</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#6-%E8%AE%BE%E7%BD%AECanvas-Nest%E5%8A%A8%E6%80%81%E8%83%8C%E6%99%AF"><span class="nav-number">6.</span> <span class="nav-text">6. 设置Canvas Nest动态背景</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#7-%E6%96%87%E7%AB%A0%E6%9C%AB%E5%B0%BE%E6%B7%BB%E5%8A%A0%E7%89%88%E6%9D%83%E8%AF%B4%E6%98%8E"><span class="nav-number">7.</span> <span class="nav-text">7. 文章末尾添加版权说明</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#8-%E6%B7%BB%E5%8A%A0%E8%AE%BF%E9%97%AE%E9%87%8F%E7%BB%9F%E8%AE%A1"><span class="nav-number">8.</span> <span class="nav-text">8. 添加访问量统计</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#9-%E5%A2%9E%E5%8A%A0%E6%9C%AC%E5%9C%B0%E6%90%9C%E7%B4%A2%E5%8A%9F%E8%83%BD"><span class="nav-number">9.</span> <span class="nav-text">9. 增加本地搜索功能</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#10-%E5%8D%9A%E5%AE%A2%E6%8F%90%E4%BA%A4%E7%99%BE%E5%BA%A6%E5%92%8CGoogle%E6%94%B6%E5%BD%95"><span class="nav-number">10.</span> <span class="nav-text">10. 博客提交百度和Google收录</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#11-%E5%8D%9A%E6%96%87%E7%BD%AE%E9%A1%B6%E5%8A%9F%E8%83%BD"><span class="nav-number">11.</span> <span class="nav-text">11. 博文置顶功能</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#12-%E4%BD%BF%E7%94%A8markdown%E6%96%B9%E5%BC%8F%E6%8F%92%E5%85%A5%E5%9B%BE%E7%89%87"><span class="nav-number">12.</span> <span class="nav-text">12. 使用markdown方式插入图片</span></a></li></ol></div>
      </div>
      <!--/noindex-->

      <div class="site-overview-wrap sidebar-panel">
        <div class="site-author motion-element" itemprop="author" itemscope itemtype="http://schema.org/Person">
  <p class="site-author-name" itemprop="name">Lu</p>
  <div class="site-description" itemprop="description">遇事不决，可问春风</div>
</div>
<div class="site-state-wrap motion-element">
  <nav class="site-state">
      <div class="site-state-item site-state-posts">
          <a href="/archives/">
        
          <span class="site-state-item-count">2</span>
          <span class="site-state-item-name">日志</span>
        </a>
      </div>
      <div class="site-state-item site-state-categories">
            <a href="/categories/">
          
        <span class="site-state-item-count">1</span>
        <span class="site-state-item-name">分类</span></a>
      </div>
      <div class="site-state-item site-state-tags">
            <a href="/tags/">
          
        <span class="site-state-item-count">4</span>
        <span class="site-state-item-name">标签</span></a>
      </div>
  </nav>
</div>



      </div>

    </div>
  </aside>
  <div id="sidebar-dimmer"></div>


      </div>
    </main>

    <footer class="footer">
      <div class="footer-inner">
        

        

<div class="copyright">
  
  &copy; 2023-04
  <span class="with-love">
    <i class="fa fa-user"></i>
  </span>
  <span class="author" itemprop="copyrightHolder">Lu</span>
</div>
  <div class="powered-by">由 <a href="https://hexo.io/" class="theme-link" rel="noopener" target="_blank">Hexo</a> & <a href="https://mist.theme-next.org/" class="theme-link" rel="noopener" target="_blank">NexT.Mist</a> 强力驱动
  </div><script color="0,0,255" opacity="0.5" zIndex="-1" count="99" src="https://cdn.jsdelivr.net/npm/canvas-nest.js@1/dist/canvas-nest.js"></script>

        
<div class="busuanzi-count">
  <script async src="https://busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js"></script>
    <span class="post-meta-item" id="busuanzi_container_site_uv" style="display: none;">
      <span class="post-meta-item-icon">
        <i class="fa fa-user"></i>
      </span>
      <span class="site-uv" title="总访客量">
        <span id="busuanzi_value_site_uv"></span>
      </span>
    </span>
    <span class="post-meta-divider">|</span>
    <span class="post-meta-item" id="busuanzi_container_site_pv" style="display: none;">
      <span class="post-meta-item-icon">
        <i class="fa fa-eye"></i>
      </span>
      <span class="site-pv" title="总访问量">
        <span id="busuanzi_value_site_pv"></span>
      </span>
    </span>
</div>








      </div>
    </footer>
  </div>

  
  <script src="/lib/anime.min.js"></script>
  <script src="/lib/velocity/velocity.min.js"></script>
  <script src="/lib/velocity/velocity.ui.min.js"></script>

<script src="/js/utils.js"></script>

<script src="/js/motion.js"></script>


<script src="/js/schemes/muse.js"></script>


<script src="/js/next-boot.js"></script>




  




  
<script src="/js/local-search.js"></script>













  

  

</body>
</html>
